<extend name="Public/base" />
<block name="body">
    <div class="tab-wrap">
        <section class="tab-content">
            <div class="tab-pane in tab1">
                <div class="cf">
                    <div class="form-item fl">
                        <div class="controls">
                            <a href="{:U('Shop/addEditCategory')}" class="btn btn-default pull-right"><i class="fa fa-plus"></i>新增分类</a>
                        </div>
                    </div>
                </div>
                <div class="data-table">
                    <div class="row">
                        <div class="col-sm-12">
                            <table id="list-table" class="table table-bordered table-striped dataTable" role="grid" aria-describedby="example1_info">
                                <thead>
                                    <tr role="row">
                                        <th valign="middle">分类ID</th>
                                        <th valign="middle">分类名称</th>
                                        <th valign="middle">显示名称</th>
                                        <th valign="middle">是否推荐</th>
                                        <th valign="middle">是否显示</th>
                                        <th valign="middle">操作</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <foreach name="cat_list" item="vo" key="k">
                                        <tr role="row" align="center" class="{$vo.level}" id="{$vo.level}_{$vo.id}" <if condition="$vo[level] gt 1">style="display:none"</if>>
                                            <td>{$vo.id}</td>
                                            <td align="left" style="padding-left:<?php echo ($vo[level] * 5); ?>em">
                                                <if condition="$vo.have_son eq 1">
                                                    <span class="iconfont btn-warning" style="padding:2px; font-size:12px;"  aria-hidden="false" onclick="rowClicked(this)">&#xe600;</span>&nbsp;
                                                </if>
                                                <span>{$vo.name}</span>
                                            </td>
                                            <td><span>{$vo.mobile_name}</span></td>
                                            <td>
                                                <if condition='$vo[is_hot] eq 1'>
                                                	<a href="#" title="点击修改">已推荐</a>
                                                	<else />
                                                	<a href="#" title="点击修改">未推荐</a>
                                                </if>
                                            </td>
                                            <td>
                                            	<if condition='$vo[is_show] eq 1'>
														<a href="#" title="点击修改">已显示</a>
                                            		<else />
														<a href="#" title="点击修改">不显示</a>
                                            	</if>
                                            </td>
                                            <td>
                                                <a class="btn btn-default" href="{:U('Shop/addEditCategory',array('id'=>$vo['id']))}">编辑</a>
                                                <a class="btn btn-default" href="{:U('Shop/delGoodsCategory',array('id'=>$vo['id']))}" target-form="ids">删 除</a>
                                            </td>
                                        </tr>
                                    </foreach>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-5">
                            <div class="dataTables_info" id="example1_info" role="status" aria-live="polite">分页</div>
                        </div>
                    </div>
                </div>
                <!-- /.box-body -->
            </div>
            <!-- /.box -->
    </div>
    </section>
</block>
<block name='script'>
	<script type="text/javascript">
		   
// 以下是 bootstrap 自带的  js
function rowClicked(obj)
{
  span = obj;

  obj = obj.parentNode.parentNode;

  var tbl = document.getElementById("list-table");

  var lvl = parseInt(obj.className);

  var fnd = false;
  
  var sub_display = $(span).hasClass('glyphicon-minus') ? 'none' : '' ? 'block' : 'table-row' ;
  //console.log(sub_display);
  if(sub_display == 'none'){
	  $(span).removeClass('glyphicon-minus btn-info');
	  $(span).addClass('glyphicon-plus btn-warning');
  }else{
	  $(span).removeClass('glyphicon-plus btn-info');
	  $(span).addClass('glyphicon-minus btn-warning');
  }

  for (i = 0; i < tbl.rows.length; i++)
  {
      var row = tbl.rows[i];
      
      if (row == obj)
      {
          fnd = true;         
      }
      else
      {
          if (fnd == true)
          {
              var cur = parseInt(row.className);
              var icon = 'icon_' + row.id;
              if (cur > lvl)
              {
                  row.style.display = sub_display;
                  if (sub_display != 'none')
                  {
                      var iconimg = document.getElementById(icon);
                      $(iconimg).removeClass('glyphicon-plus btn-info');
                      $(iconimg).addClass('glyphicon-minus btn-warning');
                  }else{               	    
                      $(iconimg).removeClass('glyphicon-minus btn-info');
                      $(iconimg).addClass('glyphicon-plus btn-warning');
                  }
              }
              else
              {
                  fnd = false;
                  break;
              }
          }
      }
  }

  for (i = 0; i < obj.cells[0].childNodes.length; i++)
  {
      var imgObj = obj.cells[0].childNodes[i];
      if (imgObj.tagName == "IMG")
      {
          if($(imgObj).hasClass('glyphicon-plus btn-info')){
        	  $(imgObj).removeClass('glyphicon-plus btn-info');
        	  $(imgObj).addClass('glyphicon-minus btn-warning');
          }else{
        	  $(imgObj).removeClass('glyphicon-minus btn-warning');
        	  $(imgObj).addClass('glyphicon-plus btn-info');
          }
      }
  }

}
	</script>	

</block>
